(function (aopc) {
    aopc.addExpandPage(805, function (get) {
        const Common = get('UtilsCommon', 'Common');
        const Bridge = get('UtilsCommon', 'Bridge');
        const $ = get('jquery', "$");

        return {
            expandInit() {
                this.selectUserDialog1 = this.getProperty('selectUserDialog1');

                this.userDataList = this.getProperty('Points');
                this.image_view = this.getProperty('image_view');
                this.textProperty = this.image_view.properties[0];
                this.image_view.properties = [];
                this.select_layout_button = this.getProperty('select_layout_button');
                this.select_bg_image = this.getProperty('select_bg_image');
                this.start_button_view = this.getProperty('start_button_view');
                this.select_welcome_dialog_view = this.getProperty('select_welcome_dialog_view');
                this.select_layout_dialog_view = this.getProperty('select_layout_dialog_view');
                this.welcomeBackImageProperty = this.getViewProperty(this.select_welcome_dialog_view, 'WelcomeBackImageUrl');
                this.image_datalist = this.getViewProperty(this.select_welcome_dialog_view, 'image_datalist');
                this.keyword = this.getViewProperty(this.select_welcome_dialog_view, 'keyword');
                this.keyword.valueChange = this.keywordChange.bind(this);

                this.layoutImages = this.getViewProperty(this.select_layout_dialog_view, 'LayoutImages');
                this.layoutImages.valueChange = this.layoutImagesChange.bind(this);
                this.select_ImageUrl = this.getViewProperty(this.select_layout_dialog_view, 'ImageUrl');

                this.isBook = this.pageData.IsBook === 'true';
                this.start_button_view.properties[0].text = this.isBook ? '确定' : '开始会议';

                let url = this.pageData.ref === '2' ? '/meetingSubjectEdit.html' : '/quickMeeting.html';
                url += '?MeetingId=' + this.pageData.MeetingId + "&ref=" + this.pageData.ref + "&IsBook=" + this.pageData.IsBook;
                if (this.pageData.backUrl2) url += "&backUrl2=" + encodeURIComponent(this.pageData.backUrl2);
                this.pageConfig.backUrl = url;

                this.toBackAction = 'toLayoutBack';
            },
            setInit() {
                const isWelcomePage = this.getProperty('IsWelcomePage');
                this.setOnOffProeprty(isWelcomePage);

                const isInSign = this.getProperty('IsInSign');
                this.setOnOffProeprty(isInSign);
            },
            toLayoutBack({ property }) {
                if (property.isBackSave) return;
                this.isBackSave = true;
                $("#start_button_view_id").click();
            },
            keywordChange(value) {
                if (!this.keyword.isChanged) return;
                this.searchImage(value);
            },
            searchImage(keyword) {
                if (!this.image_datalist.dataSource2) this.image_datalist.dataSource2 = this.image_datalist.dataSource;

                let list = this.image_datalist.dataSource2;
                if (!Common.isNullOrEmpty(keyword)) list = list.filter(f => f.Title.indexOf(keyword) >= 0);

                this.image_datalist.dataSource = list;
                this.image_datalist.refreshOptions();
            },
            importUsers() {
                Bridge.importUsers((data) => {
                    let dataList = this.entityData.Points;
                    for (let i = 0; i < data.Users.length; i++) {
                        if (i < dataList.length) {
                            dataList[i]["UserName"] = data.Users[i].UserName;
                            dataList[i]["DeviceRole"] = data.Users[i].DeviceRole;
                        }
                    }
                    this.refreshPoints(dataList);
                });
            },
            exportUsers() {
                Bridge.exportUsers(this.userDataList.dataSource);
            },
            layoutImagesChange(value, list) {
                if (!list || list.length === 0) return;

                const item = list[0];
                this.select_ImageUrl.setValue(item.ImageUrl);
            },
            expandDataLoad({ data }) {
                if (data.MeetingId) {
                    this.entityData = data;
                    this.layoutImagePoints = {};
                    if (data.ImageUrl) this.setImageLoad(data.ImageUrl);
                    this.setImagePoints(data.Points || []);
                    this.setIsVisible(this.select_layout_button, data.LayoutCount > 1);
                    this.setIsVisible(this.start_button_view, true);

                    this.layoutImagePoints[data.LayoutImageId] = data.Points;

                    if (data.IsWelcomePage) this.select_bg_image.setIsVisible(true);
                }
            },
            setImageLoad(src) {
                const img = new Image();
                img.src = src;
                img.onload = () => {
                    this.image_view.style.width = img.width + 'px';
                    this.image_view.style.height = img.height + 'px';
                    this.image_view.style.backgroundImage = `url(${img.src})`;
                    this.image_view.refresh();
                };
            },
            getMeetingRoomId() {
                return { pathQuery: "&filter=MeetingRoomId eq @MeetingRoomId&@MeetingRoomId=" + this.entityData.MeetingRoomId }
            },
            expandSetProperties({ p }) {
                if (p.name === 'UserName') {
                    p.onBlur = this.inputBlur.bind(this);
                }
                else if (p.name === 'DisplayIndex') {
                    p.dataSource = this.entityData.Points;
                    p.expandSetValue = this.displayExpandSetValue.bind(this);
                    p.getExpandOptions = () => this.entityData.Points.map(m => ({ value: m.DisplayIndex, label: m.UserName, valueText: m.DeviceName }));
                }
            },
            displayExpandSetValue(selectValue, currentValue, property) {
                if (!selectValue || !property.isChanged) return;

                const selectData = Common.arrayFirst(this.entityData.Points, f => f.DisplayIndex === selectValue);
                const currentData = Common.arrayFirst(this.entityData.Points, f => f.DisplayIndex === currentValue);
                if (selectData && currentData) {
                    const userName = selectData.UserName;
                    selectData.UserName = currentData.UserName;
                    currentData.UserName = userName;

                    this.refreshPoints(this.entityData.Points);
                }
            },
            setIsVisible(p, v) {
                p.isVisible = v;
                p.setIsVisible && p.setIsVisible(v);
            },
            inputBlur(v, p) {
                this.setImagePoints(this.entityData.Points);
            },
            setImagePoints(dataList) {
                const list = [];
                dataList.forEach(d => {
                    if (d.IsPoint) {
                        const p = Common.clone(this.textProperty);
                        p.id = Common.createGuid();
                        p.width = d.Width + 'px';
                        p.height = d.Height + 'px';
                        p.style.top = d.Y + 'px';
                        p.style.left = d.X + 'px';
                        p.text = d.UserName || d.DisplayIndex;
                        p.spanStyle = { fontSize: this.entityData.FontSize || 24, color: this.entityData.FontColor || '#000000' };
                        list.push(p);
                    }
                });
                this.image_view.properties = list;
                this.image_view.refresh();
            },
            setOnOffProeprty(p) {
                p.isEdit = true;
                const theme = this.theme;
                p.setValue = function (v) {
                    this.value = v;
                    const p2 = this.properties[0];
                    if (theme === 'red') {
                        p2.style.background = v ? 'linear-gradient(180deg, #FF3636 0%, #E40404 100%)' : '#D1B2B2';
                    }
                    else p2.style.background = v ? 'linear-gradient(90deg, #3B9DF5 0%, #2D60FA 100%)' : '#9AA3BB';
                    p2.style.justifyContent = v ? 'flex-end' : 'flex-start';
                    p2.refresh();
                };
                p.getValue = function () { return this.value ? 1 : 0; };
            },
            setChecked({ property }) {
                property.setValue(!property.value);
                if (property.name === 'IsWelcomePage') {
                    this.select_bg_image.setIsVisible(property.value);
                }
            },
            selectUsers({ property }) {
                if (!property.obj) property.obj = {
                    setSelectUsers: () => {
                        this.setSelectUsers(property.obj.dataSource);
                    },
                    title: "选择用户",
                    isMultiple: true
                };
                this.selectUserDialog1.pageAxis.showUsersDialog(property.obj);
            },
            setSelectUsers(list) {
                let dataList = this.entityData.Points;
                for (let i = 0; i < list.length; i++) {
                    if (i < dataList.length) {
                        dataList[i]["UserName"] = list[i].Name;
                    }
                }
                this.refreshPoints(dataList);
            },
            refreshPoints(dataList) {
                dataList = dataList.map(m => { m.DisplayIndex2 = m.DisplayIndex; return m; });
                this.setImagePoints(dataList);
                this.userDataList.dataSource = dataList;
                this.entityData.Points = dataList;
                this.userDataList.refreshOptions();
            },
            showSelectLayoutImage() {
                this.layoutImages.value = this.entityData.LayoutImageId;
                this.select_layout_dialog_view.setIsVisible(true);
            },
            setSelectLayoutImagePoints(points) {
                for (let i = 0; i < points.length; i++) {
                    const p = points[i];
                    p.DeviceName = `设备${p.DisplayIndex}`;
                    if (i < this.entityData.Points.length) {
                        const item = this.entityData.Points[i];
                        p.UserName = item.UserName;
                        p.DeviceRole = item.DeviceRole;
                    }
                }
                this.refreshPoints(points);
            },
            setSelectLayoutImage({ property }) {
                const dataList = this.layoutImages.getSelectData();
                if (dataList.length > 0) {
                    const item = dataList[0];
                    if (item.LayoutImageId !== this.entityData.LayoutImageId) {
                        this.entityData.LayoutImageId = item.LayoutImageId;
                        this.entityData.ImageUrl = item.ImageUrl;
                        this.entityData.FontColor = item.FontColor;
                        this.entityData.FontSize = item.FontSize;
                        if (item.ImageUrl) this.setImageLoad(item.ImageUrl);

                        if (this.layoutImagePoints[item.LayoutImageId]) this.setSelectLayoutImagePoints(this.layoutImagePoints[item.LayoutImageId]);
                        else {
                            const { serviceName, actionName } = property.serviceInterface;
                            const payload = { pathQuery: '&$filter=LayoutImageId eq @LayoutImageId&@LayoutImageId=' + item.LayoutImageId };

                            this.dispatchAction(serviceName, actionName, payload).then(res => {
                                if (res.isSuccess !== false) {
                                    this.layoutImagePoints[item.LayoutImageId] = res || [];
                                    this.setSelectLayoutImagePoints(this.layoutImagePoints[item.LayoutImageId]);
                                }
                            });
                        }
                    }
                }
                this.select_layout_dialog_view.setIsVisible(false);
            },
            successCallback({ props }) {
                const { property } = props;
                if (this.isBackSave) {
                    this.isBackSave = false;
                    this.toBack3();
                    return;
                }
                this.alertSuccess('保存成功！', () => {
                    if (this.isBook) {
                        this.replacePage(this.pageData.backUrl2 ? '/myMeeting.html' : '/bookMeetingList.html');
                    }
                    else {
                        this.editEntityData.MeetingId = this.pageData.MeetingId;
                        this.editEntityData.IsAsr = this.entityData.IsAsr;
                        this.startMeeting({ entityData: this.editEntityData, serviceInterface: property.serviceInterface })
                    }
                });
            },
            expandSetEntityData({ entityData }) {
                entityData.LayoutImageId = this.entityData.LayoutImageId;

                entityData.LayoutUsers = this.entityData.Points;

                this.editEntityData = entityData;

                return entityData;
            },
            saveWelcomeImageCallback({ data }) {
                this.alertSuccess('设置成功！', () => {
                    this.entityData.WelcomeBackImageUrl = this.welcomeBackImageProperty.getValue();
                    this.select_welcome_dialog_view.setIsVisible(false);
                    this.entityData.RowVersion = data.RowVersion;
                });
            },
            setWecomeImage() {
                this.image_datalist.isCache = false;
                this.welcomeBackImageProperty.value = this.entityData.WelcomeBackImageUrl;
                this.welcomeBackImageProperty.setValue && this.welcomeBackImageProperty.setValue(this.entityData.WelcomeBackImageUrl);
                this.select_welcome_dialog_view.setIsVisible(true);
            },
            setRightImage({ property }) {
                const p = property.properties[0];
                this.welcomeBackImageProperty.setValue(p.value);
            },
            refreshDataList() {
                this.image_datalist.id = Common.createGuid();
                this.image_datalist.isCache = false;
                this.image_datalist.refreshOptions();
            },
            deleteItem({ property, view }) {
                if (property.isLoading) return;

                const { serviceInterface } = property;
                const { ImageId, RowVersion, Title } = view.entityData;
                this.confirm(`确定要删除${Title}该背景图吗？`, () => {
                    const { serviceName, actionName } = serviceInterface;
                    const payload = { url: `MeetingWelcomeImage(${ImageId})?RowVersion=${RowVersion}` }

                    property.isLoading = true;
                    this.dispatchAction(serviceName, actionName, payload).then(res => {
                        property.isLoading = false;
                        if (res.isSuccess !== false) {
                            this.alertSuccess('删除成功！', () => {
                                this.refreshDataList();
                            });
                        }
                    });
                });
            }
        }
    });
})(window.aopc);